<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>

	<script>
	window.onload = function() {
		var aImg = document.getElementsByTagName('img');
		var oP = document.getElementById('p1')
		var arr = [0,1,3,4,6,7];			//需要该改变的图片位置

		function fn() {
			var oDate = new Date();
			var oHours = oDate.getHours();
			var oMin = oDate.getMinutes();
			var oSec = oDate.getSeconds();

			var str = toTwo(oHours) + toTwo(oMin) + toTwo(oSec);
			oP.innerHTML = str;

			for (var i = 0; i < arr.length; i++) {
				aImg[arr[i]].src = str.charAt(i) + '.jpg';
			};
		}
		
		fn();
		setInterval(fn,1000)

	}
		function toTwo(n) {
			return n = n < 10 ? '0'+n : ''+n;
		}
	
	</script>
</head>
<body>
	<p id="p1"></p>
	<img src="0.jpg">
	<img src="0.jpg">
	<img src="colon.jpg">
	<img src="0.jpg">
	<img src="0.jpg">
	<img src="colon.jpg">
	<img src="0.jpg">
	<img src="0.jpg">
</body>
</html>